<template>
	<view class="signature">
		<view class="text">
			<uni-easyinput type="textarea" autoHeight v-model="signature" placeholder="请输入内容"></uni-easyinput>
		</view>
		<view class="btn" @click="saveSignature">
			<text class="text">保存</text>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		getCurrentInstance
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app'
	const {
		proxy
	} = getCurrentInstance()

	let userInfo = uni.getStorageSync('userInfo')
	const signature = ref()
	onLoad((option) => {
		signature.value = option.signature
	})
	const saveSignature = () => {
		if (signature.value.length > 50) {
			uni.showToast({
				title: "超出50字符",
				icon: 'error',
				duration: 1000
			})
			return
		}
		uni.showLoading({
			title: '保存中...'
		})
		proxy.$http("setUserInfo", {
			signature: signature.value
		}).then(res => {
			if (!res.errCode) {
				uni.showToast({
					title: res.result.msg,
					icon: 'none',
					duration: 1000
				})
				userInfo.signature = signature.value
				uni.setStorageSync('userInfo', userInfo)
				uni.hideLoading()
				setTimeout(() => {
					uni.$emit('signature', {
						signature: signature.value
					})
					uni.navigateBack({
						delta: 1
					})
				}, 500)
			}
		})
	}
</script>

<style lang="scss">
	.signature {
		margin: 40rpx 20rpx;

		.is-input-border {
			border: none;
			border-radius: 18rpx;
		}

		.btn {
			margin: 50rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 80rpx;
			border-radius: 50rpx;
			background: #87C38F;

			.text {
				color: #fff;
				font-size: 34rpx;
				font-weight: bold;
			}
		}
	}
</style>